<template>
	<view class="serve">
		<p class="text">{{ myprops }}</p>
		<view class="serve-view">
			<view class="serve-view-he" @click="hetong">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/洗钱审查@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>合同审查</text>
			</view>
			<view class="serve-view-he" @click="wenshu">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/入学考试@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>文书代写</text>
			</view>
			<view class="serve-view-he" @click="lvshihan">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/制度清单@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>律师函</text>
			</view>
			<view class="serve-view-he" @click="huji">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/产品定位@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>户籍调查</text>
			</view>
			<view class="serve-view-he" @click="minshi">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/制度审查@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>民事起诉状</text>
			</view>
			<view class="serve-view-he" @click="lihun">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/离婚证复印件打印@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>离婚咨询</text>
			</view>
			<view class="serve-view-he" @click="laodong">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/市场竞争@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>劳动仲裁委托</text>
			</view>
			<view class="serve-view-he" @click="weituo">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/法律事务@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>委托律师</text>
			</view>
			<view class="serve-view-he" @click="gongshang">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/制度清单@1x (1).png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>工伤赔偿</text>
			</view>
			<view class="serve-view-he" @click="hehuo">
				<view class="serve-view-he-sc" :style="{backgroundColor: mycolor}">
					<image src="../../static/数据分析@1x.png" mode="" style="width: 44rpx; height: 44rpx;"></image>
				</view>
				<text>合伙协议</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"handpick",
		props: {
			myprops: {
				type: String,
				default: '精选服务'
			},
			mycolor: {
				type: String,
				default: '#F0F4FA'
			}
		},
		data() {
			return {
				
			};
		},
		methods : {
			// 合同审查
			hetong () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=合同审查"
				})
			},
			// 文书代写
			wenshu () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=文书代写"
				})
			},
			// 律师函
			lvshihan () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=律师函"
				})
			},
			// 户籍调查
			huji () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=户籍调查"
				})
			},
			// 民事起诉状
			minshi () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=民事起诉状"
				})
			},
			// 离婚咨询
			lihun () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=离婚咨询"
				})
			},
			// 劳动仲裁委托
			laodong () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=劳动仲裁委托"
				})
			},
			// 委托律师
			weituo () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=委托律师"
				})
			},
			// 工伤赔偿
			gongshang () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=工伤赔偿"
				})
			},
			// 合伙协议
			hehuo () {
				uni.navigateTo({
					url: "/pages/Attorney side/consult/consult?name=合伙协议"
				})
			},
		}
	}
</script>

<style>
.serve {
		width: 750rpx;
		height: 390rpx;
	}
	.serve > .text {
		display: block;
		height: 32rpx;
		opacity: 1;
		font-size: 28rpx;
		font-weight: bold;
		line-height: 32rpx;
		letter-spacing: 0rpx;
		color: #383838;
		margin: 32rpx 0 0 28rpx;
	}
	.serve-view {
		width: 682rpx;
		height: 292rpx;
		margin: 26rpx 0 0 40rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-evenly;
	}
	.serve-view-he {
		width: 120rpx;
		height: 120rpx;
		font-size: 24rpx;
		font-weight: 500;
		line-height: 28rpx;
		text-align: center;
		letter-spacing: 0rpx;
		color: #383838;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}
	.serve-view-he-sc {
		width: 84rpx;
		height: 84rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #F0F4FA;
		border-radius: 20rpx;
	}
	.serve-view :nth-child(7) > text {
		width: 144rpx;
	}
</style>